<!--
* description: 技术援助申请
* author:shensai
* createdDate:2021-1-28
-->
<template>
  <section class="editBigAreaInfo">
    <el-dialog
      v-dialogDrag
      :close-on-click-modal="false"
      :title="textMap[popupsState]"
      :append-to-body="true"
      :visible.sync="curPopupsVisible"
      width="70%"
      @close="closeEdit"
      @opened="open"
    >
      <dialogHeader
        slot="title"
        :title="titleName"
        :style-type="$store.state.app.dialogType"
      />

      <div class="filter-container filter-title">基本信息</div>
      <div class="filter-container filter-params huifu">
        <el-button class="add" type="primary" @click="save">保存</el-button>
        <!-- <el-button class="dele" type="primary">提交</el-button> -->
      </div>
      <div class="filter-container filter-params">
        <el-row ref="vailComponentList" :gutter="26">
          <!-- <component
            :is="comp.component"
            v-for="comp in tableComponents1.filter(o => o.isMust === true)"
            :ref="comp.isRequire ? comp.isRequire + comp.compKey : comp.compKey"
            :key="comp.compKey"
            :validrule="comp.validrule"
            :code-field="comp.codeField"
            :text-field="comp.textField"
            :popups-key="comp.compKey"
            :parent-fileds="comp.parentFileds || ''"
            :code="formField1[comp.codeField]"
            :disabled="comp.disabled"
            :is-require="comp.isRequire"
            :span="comp.span || 6"
            :label-name="comp.labelName"
            :lookuptype="comp.lookuptype"
            :options="comp.options"
            :o-fields="comp.oFields"
            @changeCode="getComponentCode"
          /> -->
          <one-table-template
            ref="multipleTable1"
            :key="oneTableKey"
            :dynamic-components="tableComponents1"
            :dynamic-form-fields="formField1"
            :dynamic-is-show-select="false"
            :dynamic-is-init-table="true"
            :dynamic-api-style="'restful'"
          />
        </el-row>
      </div>

      <div class="filter-container filter-title">故障信息</div>
      <div class="filter-container filter-params">
        <el-row ref="vailComponentList" :gutter="26">
          <!-- <component
            :is="comp.component"
            v-for="comp in tableComponents2.filter(o => o.isMust === true)"
            :ref="comp.isRequire ? comp.isRequire + comp.compKey : comp.compKey"
            :key="comp.compKey"
            :validrule="comp.validrule"
            :code-field="comp.codeField"
            :text-field="comp.textField"
            :popups-key="comp.compKey"
            :parent-fileds="comp.parentFileds || ''"
            :code="formField2[comp.codeField]"
            :disabled="comp.disabled"
            :is-require="comp.isRequire"
            :span="comp.span || 6"
            :label-name="comp.labelName"
            :lookuptype="comp.lookuptype"
            :options="comp.options"
            :o-fields="comp.oFields"
            @changeCode="getComponentCode"
          /> -->
          <one-table-template
            ref="multipleTable2"
            :key="oneTableKey1"
            :dynamic-components="tableComponents2"
            :dynamic-form-fields="formField2"
            :dynamic-is-show-select="false"
            :dynamic-is-init-table="true"
            :dynamic-api-style="'restful'"
          />
        </el-row>
      </div>
      <div class="filter-container filter-title">其他信息</div>
      <one-table-template
        ref="multipleTable"
        :key="oneTableKey2"
        :dynamic-buttons="tableButtons_4_2"
        :dynamic-components="tableComponents"
        :dynamic-table-cols="tableCols1"
        :dynamic-api-config="apiConfig"
        :dynamic-form-fields="formField3"
        :dynamic-is-show-select="true"
        :dynamic-is-show-more-btn="true"
        :dynamic-table-defult-height="300"
        :is-show-pagination="false"
        :callback-obj="callbackObj"
      />
      <inEdit
        :key="inEditPopupsKey"
        :dynamic-edit-row-datas="dataForForm"
        :popups-visible="inEditPopupsVisible"
        @updateVisible="updateClose"
        @func="getMsgFile"
      />

      <!-- <div class="filter-container filter-title">反馈/回复信息</div>
      <div class="filter-container filter-params huifu">
        <one-table-template
          ref="multipleTable"
          :dynamic-table-cols="tableCols3"
          :dynamic-api-config="apiConfig"
          :dynamic-form-fields="formField5"
          :dynamic-is-show-select="false"
          :dynamic-is-show-more-btn="true"
          :dynamic-table-defult-height="300"
          :isShowPagination="false"
        />
        <el-button class="add aa" icon="iconfont icon-newlyAdded" type="primary"
          >新增反馈</el-button
        >
        <el-button
          class="dele aa"
          type="primary"
          icon="iconfont icon-deleteSheet"
          >提交</el-button
        >
        <one-table-template
          ref="multipleTable"
          :dynamic-table-cols="tableCols4"
          :dynamic-api-config="apiConfig"
          :dynamic-form-fields="formField6"
          :dynamic-is-show-select="false"
          :dynamic-is-show-more-btn="true"
          :dynamic-table-defult-height="300"
          :isShowPagination="false"
        />
      </div> -->

      <!-- <div slot="footer" class="dialog-footer">
				<el-button
					v-for="comp in tableButtons"
					:key="comp.compKey"
					:type="comp.type"
					:icon="comp.icon"
					@click="comp.clickEvent"
					>{{ comp.text }}</el-button
				>
			</div> -->
    </el-dialog>
  </section>
</template>
<script>
import { oneTableWithViewTemplateMixins } from '@/components/mixins/oneTableWithViewTemplateMixins'
import { formMixins } from '@/components/mixins/formMixins'
import OneTableTemplate from '@/components/templates/oneTable'
import { vehiclePdiPriceInquirys } from '@/api/se/vehiclePdiPriceInquiry'
import request from '@/utils/request'
import Vue from 'vue'
export default {
  components: {
    dialogHeader: () => import('@/components/dialogHeader'),
    OneTableTemplate,
    inEdit: () => import('./inEdit')
  },

  // 组件混入对象
  mixins: [oneTableWithViewTemplateMixins, formMixins],

  // 阻塞路由预加载网格中组件的数据
  beforeRouteEnter(to, from, next) {
    Vue.prototype.$ConfigCache.CacheConfig.initData([to.path, ''], function() {
      next()
    })
  },

  props: {
    popupsVisible: { type: Boolean, default: false },
    // 从网格传入的编辑行数据(json)
    dynamicEditRowData: {
      type: Object,
      default: function() {
        return {}
      }
    }
  },

  data() {
    return {

      inEditPopupsVisible: false,
      isExists: false,
      titleName: '技术援助申请',
      tableButtons_4_2: [
        {
          compKey: 'btnKey1',
          type: 'primary',
          size: 'small',
          clickEvent: () => this.handFileListChange(),
          name: 'importTemplate',
          position: 'upload',
          text: '附件上传'
        },
        {
          compKey: 'btnKey3',
          type: 'primary',
          size: 'small',
          clickEvent: () => this.delEvent(),
          name: 'reject',
          position: 'left',
          text: '删除'
        },
        {
          compKey: 'btnKey2',
          type: 'primary',
          size: 'small',
          clickEvent: () => this.inEdits(),
          name: 'add',
          position: 'left',
          text: '新增'
        }
      ],
      // 动态组件-查询条件
      tableComponents1:
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents1 &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents1.length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
            .tableComponents1
          : [
            {
              compKey: 'compKey4',
              labelName: '申请编号：',
              codeField: 'applyCode',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              disabled: true,
              isMust: true
            },
            {
              compKey: 'compKey5',
              labelName: '申请日期：',
              codeField: 'applyDate',
              component: () =>
                import('@/components/org/datePicker/datePicker.vue'),
              type: 'datePicker',
              isRequire: true,
              isMust: true
            },
            {
              compKey: 'compKey6',
              labelName: '类型：',
              codeField: 'type',
              component: () => import('@/components/org/LookupValue'),
              oFields: 'statusId,statusText',
              type: 'dropdownList',
              options: [
                { statusId: '1', statusText: '技术援助单' },
                { statusId: '2', statusText: '故障反馈单' },
                { statusId: '3', statusText: '火灾事故' }
              ],
              isRequire: true,
              isMust: true
            },
            {
              compKey: 'compKey7',
              labelName: '紧急度：',
              codeField: 'urgency',
              component: () => import('@/components/org/LookupValue'),
              oFields: 'statusId,statusText',
              type: 'dropdownList',
              options: [
                { statusId: '1', statusText: '低' },
                { statusId: '2', statusText: '中' },
                { statusId: '3', statusText: '高' }
              ],
              isRequire: true,
              isMust: true
            },
            {
              compKey: 'compKey8',
              labelName: '门店编码：',
              codeField: 'dlrCode',
              component: () => import('@/components/org/commonInput'),
              type: 'dropdownList',
              disabled: true,
              isMust: true
            },
            {
              compKey: 'compKey9',
              labelName: '门店名称：',
              codeField: 'dlrShortName',
              component: () => import('@/components/org/commonInput'),
              type: 'dropdownList',
              disabled: true,
              isMust: true
            },
            // {
            //   compKey: "compKey7",
            //   labelName: "区域：",
            //   codeField: "licenseLocationCity",
            //   component: () => import("@/components/org/commonSelect"),
            //   type: "dropdownList",
            //   disabled: true,
            //   isMust: true,
            // },
            {
              compKey: 'compKey10',
              labelName: '省/市：',
              codeField: 'provinceName',
              component: () => import('@/components/org/commonSelect'),
              type: 'dropdownList',
              disabled: true,
              isMust: true
            },
            // {
            //   compKey: "compKey1",
            //   labelName: "申请状态：",
            //   codeField: "qualifiedCertNo",
            //   component: () => import("@/components/org/commonSelect"),
            //   type: "inputText",
            //   disabled: true,
            //   isMust: true,
            // },
            // {
            //   compKey: "compKey2",
            //   labelName: "VIN码：",
            //   codeField: "vinCode",
            //   component: () => import("@/components/org/commonSelect"),
            //   // customObj: {
            //   //   api: '/mp/e3sh/aftersale/TechnicalAssistanceSheetService/findVinList.do',
            //   // },
            //   oFields: "vinCode,vin",
            //   options: [],
            //   type: "dropdownList",
            //   isRequire: true,
            //   isMust: true
            // },
            {
              compKey: 'compKey11',
              labelName: 'VIN码：',
              codeField: 'vin',
              textField: 'vinCode',
              component: () =>
                import(
                  '@/views/ve/planReport/components/multipleSearchInput'
                ),
              options: [],
              type: 'inputText',
              isRequire: true,
              isMust: true,
              dataToObject: {
                // 控制弹窗页面 搜索 网格 元素
                tableComponents: [
                  {
                    compKey: 'compKey12',
                    labelName: '客户手机号：',
                    codeField: 'phone',
                    component: () => import('@/components/org/commonInput'),
                    type: 'inputText',
                    isMust: true,
                    span: 6
                  },
                  {
                    compKey: 'compKey13',
                    labelName: 'VIN：',
                    codeField: 'vin',
                    component: () => import('@/components/org/commonInput'),
                    type: 'inputText',
                    isMust: true,
                    span: 6
                  },
                  {
                    compKey: 'compKey14',
                    labelName: '客户车牌号：',
                    codeField: 'carLicense',
                    component: () => import('@/components/org/commonInput'),
                    type: 'inputText',
                    isMust: true,
                    span: 6
                  },
                  {
                    compKey: 'compKey15',
                    labelName: '客户姓名：',
                    codeField: 'custName',
                    component: () => import('@/components/org/commonInput'),
                    type: 'inputText',
                    isMust: true,
                    span: 6
                  }
                ],
                tableCols: [
                  {
                    prop: 'custName',
                    label: '客户姓名'
                  },
                  {
                    prop: 'carLicense',
                    label: '客户车牌号'
                  },
                  {
                    prop: 'phone',
                    label: '客户手机号'
                  },
                  {
                    prop: 'vin',
                    label: 'VIN'
                  }
                ],
                formField: {
                  vin: '',
                  phone: '',
                  carLicense: '',
                  custName: ''
                },
                oFields: 'vinCode,vin',
                returnField: {
                  prop: 'vin',
                  label: 'vinCode'
                },
                api: vehiclePdiPriceInquirys.findVinList1
              },
              span: 6
            },
            {
              compKey: 'compKey16',
              labelName: '车系名称：',
              codeField: 'carSeriesCn',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              disabled: true,
              isMust: true
            },
            {
              compKey: 'compKey17',
              labelName: '车型编码：',
              codeField: 'carConfigCode',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              disabled: true,
              isRequire: true,
              isMust: true
            },
            {
              compKey: 'compKey18',
              labelName: '车型名称：',
              codeField: 'carConfigCn',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              disabled: true,
              isMust: true
            },
            {
              compKey: 'compKey19',
              labelName: '生产日期：',
              codeField: 'produceDate',
              component: () => import('@/components/org/commonInput'),
              type: 'dropdownList',
              disabled: true,
              isMust: true
            },
            {
              compKey: 'compKey20',
              labelName: '销售日期：',
              codeField: 'saleDate',
              component: () => import('@/components/org/commonInput'),
              type: 'dropdownList',
              disabled: true,
              isMust: true
            },
            {
              compKey: 'compKey21',
              labelName: '行驶里程：',
              codeField: 'mileage',
              component: () => import('@/components/org/commonInput'),
              type: 'dropdownList',
              isMust: true
            },
            {
              compKey: 'compKey22',
              labelName: '前电机号：',
              codeField: 'engineCode',
              component: () => import('@/components/org/commonInput'),
              type: 'dropdownList',
              disabled: true,
              isMust: true
            },
            {
              compKey: 'compKey23',
              labelName: '后电机号：',
              codeField: 'engineCode2',
              component: () => import('@/components/org/commonInput'),
              type: 'dropdownList',
              disabled: true,
              isMust: true
            },
            {
              compKey: 'compKey24',
              labelName: '电池包编号：',
              codeField: 'batteryCode',
              component: () => import('@/components/org/commonInput'),
              disabled: true,
              type: 'dropdownList',
              isMust: true
            },
            {
              compKey: 'compKey25',
              labelName: '减速器号：',
              codeField: '',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              disabled: true,
              isMust: true
            },
            {
              compKey: 'compKey26',
              labelName: '增程器编号：',
              codeField: '',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              disabled: true,
              isMust: true
            },
            {
              compKey: 'compKey27',
              labelName: '车主姓名：',
              codeField: 'netCustName',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              disabled: true,
              isMust: true
            },
            {
              compKey: 'compKey28',
              labelName: '车主电话：',
              codeField: 'netPhone',
              component: () => import('@/components/org/commonInput'),
              type: 'dropdownList',
              disabled: true,
              isMust: true
            },
            {
              compKey: 'compKey29',
              labelName: '送修人：',
              codeField: 'sendName',
              component: () => import('@/components/org/commonInput'),
              type: 'dropdownList',
              isMust: true
            },
            {
              compKey: 'compKey30',
              labelName: '送修人电话：',
              codeField: 'sendMobile',
              component: () => import('@/components/org/commonInput'),
              // validrule: {
              //   isPhone: true,
              // },
              type: 'dropdownList',
              isMust: true
            },
            {
              compKey: 'compKey31',
              labelName: '车主地址：',
              codeField: 'ownerAdd',
              component: () => import('@/components/org/commonInput'),
              type: 'dropdownList',
              span: 12,
              isMust: true
            },
            {
              compKey: 'compKey32',
              labelName: '旧申请单号：',
              codeField: 'oldApplyCode',
              component: () => import('@/components/org/commonInput'),
              type: 'dropdownList',
              span: 12,
              isMust: true
            }
          ],

      // 动态组件-查询条件
      tableComponents2:
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents2 &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents2.length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
            .tableComponents2
          : [
            {
              compKey: 'compKey33',
              labelName: '主题：',
              codeField: 'faultTopic',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              span: 24,
              isMust: true,
              isRequire: true
            },
            {
              compKey: 'compKey34',
              labelName: '故障现象：',
              codeField: 'csCtName',
              textField: 'fault',
              component: () =>
                import('@/components/wms/dropdownList/dropdownList'),
              options: [],
              type: 'dropdownList',
              isRequire: true,
              isMust: true
            },
            {
              compKey: 'compKey35',
              labelName: '故障编码：',
              codeField: 'faultCode',
              textField: 'fault',
              component: () => import('@/components/org/commonInput'),
              type: 'datePicker',
              disabled: true,
              isMust: true
            },
            // {
            //   compKey: "compKey6",
            //   labelName: "故障编码：",
            //   codeField: "faultCode",
            //   textField: "fault",
            //   component: () =>
            //     import("@/components/wms/dropdownList/dropdownList"),
            //   options: [],
            //   type: "dropdownList",
            //   isRequire: true,
            //   isMust: true,
            // },
            // {
            //   compKey: "compKey7",
            //   labelName: "故障现象：",
            //   codeField: "csCtName",
            //   component: () => import("@/components/org/commonInput"),
            //   type: "datePicker",
            //   disabled: true,
            //   isMust: true,
            // },
            // {
            //   compKey: 'compKey36',
            //   labelName: '故障系统：',
            //   codeField: 'faultSystem',
            //   component: () => import('@/components/org/LookupValue'),
            //   oFields: 'statusId,statusText',
            //   type: 'dropdownList',
            //   options: [
            //     { statusId: '1', statusText: '车身' },
            //     { statusId: '2', statusText: '驾驶室' },
            //     { statusId: '3', statusText: '底盘' }
            //   ],
            //   isRequire: true,
            //   isMust: true
            // },
            {
              compKey: 'compKey36',
              labelName: '故障系统：',
              codeField: 'faultSystem',
              lookuptype: 'SE4007',
              component: () => import('@/components/org/commonSelect'),
              type: 'dropdownList',
              customObj: {
                api: {
                  APIUrl:
                      '/mp/e3sh/aftersale/appointmentVolumnService/queryListOfValues.do'
                },
                defOptionFields: ['lookupValueCode', 'lookupValueName']
              },
              isRequire: true,
              isMust: true
            },
            //     {
            //   compKey: 'key7',
            //   labelName: '预约来源：',
            //   codeField: 'reserveSource',
            //   lookuptype: 'SE0171',
            //   component: () => import('@/components/org/commonSelect'),
            //   customObj: {
            //     api: {
            //       APIUrl: '/mp/e3sh/aftersale/appointmentVolumnService/queryListOfValues.do'
            //     }
            //   },
            //   type: 'dropdownList',
            //   isMust: true
            // },
            {
              compKey: 'compKey37',
              labelName: '故障日期：',
              codeField: 'faultDate',
              component: () =>
                import('@/components/org/datePicker/datePicker.vue'),
              type: 'inputText',
              isRequire: true,
              isMust: true
            },
            {
              compKey: 'compKey38',
              labelName: '主损件名称：',
              codeField: 'PartName',
              textField: 'Parts',
              isMul: false,
              component: () =>
                import(
                  '@/components/se/sparePartNameCode/multipleInformationDisplay'
                ),
              type: 'inputText',
              isRequire: true,
              isMust: true,
              span: 6
            },
            {
              compKey: 'compKey39',
              labelName: '主损件编码：',
              codeField: 'partNo',
              textField: 'Partse',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              disabled: true,
              isMust: true
            },
            {
              compKey: 'compKey42',
              labelName: '故障描述：',
              codeField: 'faultDesc',
              component: () =>
                import('@/components/org/commonInput/textareaInput'),
              type: 'dropdownList',
              isMust: true,
              span: 24
            },
            {
              compKey: 'compKey43',
              labelName: '诊断过程：',
              codeField: 'diagnostic',
              component: () =>
                import('@/components/org/commonInput/textareaInput'),
              type: 'dropdownList',
              isMust: true,
              span: 24
            },
            {
              compKey: 'compKey44',
              labelName: '故障原因：',
              codeField: 'faultReson',
              component: () =>
                import('@/components/org/commonInput/textareaInput'),
              type: 'dropdownList',
              isMust: true,
              span: 24
            },
            {
              compKey: 'compKey45',
              labelName: '维修方案：',
              codeField: 'repairMethod',
              component: () =>
                import('@/components/org/commonInput/textareaInput'),
              type: 'dropdownList',
              isMust: true,
              span: 24
            }
          ],

      // 标题
      textMap: {
        edit: '技术支持申请',
        add: '技术支持申请'
      },

      activeName: 'first',

      tableCols1: [
        {
          prop: 'controlBtn',
          label: '操作',
          codeField: 'controlBtn',
          width: 100,
          align: 'center',
          fixed: true,
          isComponent: true,
          comps: [
            {
              compKey: 'propKey1',
              align: 'center',
              labelName: '下载',
              component: () => import('@/components/org/linkButton'),
              clickEvent: (index) => this.fileDownload(index)
            }
          ]
        },
        {
          prop: 'fileName',
          label: '附件名称',
          align: 'center'
        },
        {
          prop: 'fileSite',
          label: '附件地址',
          align: 'center',
          hidden: true
        }
      ],
      tableCols3: [
        {
          prop: 'carSeriesCn',
          label: '回复人',
          align: 'center'
        },
        {
          prop: 'carSeriesCn',
          label: '回复时间',
          align: 'center'
        },
        {
          prop: 'carSeriesCn',
          label: '回复意见',
          align: 'center'
        }
      ],
      tableCols4: [
        {
          prop: 'carSeriesCn',
          label: '服务站反馈',
          align: 'center'
        },
        {
          prop: 'carSeriesCn',
          label: '反馈时间',
          align: 'center'
        }
      ],
      formField1: {
        vin: '',
        carConfigCode: '',
        carConfigCn: '',
        carSeriesCn: '',
        produceDate: '', // 生产日期
        saleDate: '',
        mileage: '',
        engineCode: '',
        engineCode2: '',
        batteryCode: '',
        netCustName: '',
        netPhone: '',
        applyDate: '',
        type: '',
        sendMobile: '',
        urgency: '' // 紧急度
      },
      formField2: {
        faultCode: '',
        csCtName: '',
        partNo: '',
        PartName: '', // 故障件名称
        faultSystem: '', // 故障系统
        faultDate: '', // 故障日期
        // apply: "", // 申报人
        // applyMobile: "", // 申报人电话
        faultTopic: '', // 主题
        faultDesc: '', // 故障描述
        diagnostic: '', // 诊断过程
        faultReson: '', // 故障原因
        repairMethod: '' // 维修方案
      },
      formField3: {
        fileName: '', // 附件名称
        fileSite: '', // 附件地址
        fileType: '', // 附件类型
        ecuName: '' // 备件编码
      },
      callbackObj: {
        onCheckSelectChange: (selection) => {
          this.selectTable = selection
        },
        onRowDbClick: (row, column, event, rowIndex) => {
          this.downFile(row)
        }
      }
    }
  },
  watch: {
    'formField1.vin': {
      handler: function(newVal, oldVal) {
        const queryObj = {
          type: 'mutation',
          apiConfig: {
            ServiceCode: 'findCarDetailByVin',
            APIUrl:
              '/mp/e3sh/aftersale/TechnicalAssistanceSheetService/findCarDetailByVin.do'
          },
          variables: {
            vin: this.formField1.vin
          }
        }
        var paramD = this.$getParams(queryObj)
        this.$requestAPI(paramD).then((response) => {
          this.formField1.carConfigCode = response.rows[0].carConfigCode
          this.formField1.carConfigCn = response.rows[0].carConfigCn
          this.formField1.carSeriesCn = response.rows[0].carSeriesCn
          this.formField1.produceDate = response.rows[0].produceDate
          this.formField1.saleDate = response.rows[0].saleDate
          this.formField1.mileage = response.rows[0].mileage
          this.formField1.engineCode = response.rows[0].engineCode
          this.formField1.engineCode2 = response.rows[0].engineCode2
          this.formField1.batteryCode = response.rows[0].batteryCode
          this.formField1.netCustName = response.rows[0].netCustName
          this.formField1.netPhone = response.rows[0].netPhone
          this.formField1.provinceName = response.rows[0].provinceName
          this.formField1.dlrCode = response.rows[0].dlrCode
          this.formField1.dlrShortName = response.rows[0].dlrShortName
        })
        // 如果新值为空，则清空车型车系车型名称,生产日期
        if (newVal === '') {
          this.formField1.carConfigCode = ''
          this.formField1.carConfigCn = ''
          this.formField1.carSeriesCn = ''
          this.formField1.produceDate = ''
        }
      }
    },
    'formField1.type': {
      handler: function(newval, oldval) {
        this.tableComponents1[3].options = []
        if (newval === '1' || newval === '2') {
          this.tableComponents1[3].options.push({
            statusId: '1',
            statusText: '低'
          })
          this.tableComponents1[3].options.push({
            statusId: '2',
            statusText: '中'
          })
        } else {
          this.tableComponents1[3].options.push({
            statusId: '3',
            statusText: '高'
          })
        }
        if (newval === '') {
          this.tableComponents1[3].options = []
        }
        this.formField1.urgency = ''
        this.formField1.statusId = ''
        this.formField1.statusText = ''
        this.tableComponents1[3].compKey =
          this.tableComponents1[3].compKey + '1'
      }
    },
    'formField2.csCtName': {
      handler: function(newVal, oldVal) {
        const queryObj = {
          type: 'mutation',
          apiConfig: {
            ServiceCode: 'findCsCtNameByFaultCode',
            APIUrl:
              '/mp/e3sh/aftersale/TechnicalAssistanceSheetService/findCsCtNameByFaultCode.do'
          },
          variables: {
            csCtName: newVal
          }
        }
        var paramD = this.$getParams(queryObj)
        this.$requestAPI(paramD).then((response) => {
          this.formField2.faultCode = response.rows[0].faultCode
        })
        if (newVal === '') {
          this.formField2.faultCode = ''
        }
      }
    },
    'formField2.PartName': {
      handler: function(newVal, oldVal) {
        const queryObj = {
          type: 'mutation',
          apiConfig: {
            ServiceCode: 'findFaultPartNameByMainPartCode',
            APIUrl:
              '/mp/e3sh/aftersale/TechnicalAssistanceSheetService/findFaultPartNameByMainPartCode.do'
          },
          variables: {
            PartName: this.formField2.PartName
          }
        }
        var paramD = this.$getParams(queryObj)
        this.$requestAPI(paramD).then((response) => {
          this.formField2.partNo = response.rows[0].partNo
        })
        if (newVal === '') {
          this.formField2.partNo = ''
        }
      }
    }
  },
  methods: {
    // 列表添加inEdit传过来的附件信息
    getMsgFile(val) {
      var newval = JSON.parse(JSON.stringify(val).replace(/fullName/g, 'fileName'))
      let fla = 0

      if (this.$refs['multipleTable'].list.length == 0) {
        this.$refs['multipleTable'].list.push(newval)
      } else if (this.$refs['multipleTable'].list.length > 0) {
        for (let i = 0; i < this.$refs['multipleTable'].list.length; i++) {
          if (newval.fileName == this.$refs['multipleTable'].list[i].fileName) {
            fla++
          }
        }
        if (fla == 0) {
          this.$refs['multipleTable'].list.push(newval)
        }
      }
    },

    // 附件上传
    handFileListChange(file, fileList) {
      if (this.beforeAvatarUpload(file)) {
        this.handleChange(file)
      }
    },
    // 上传附件大小限制
    beforeAvatarUpload(file) {
      if (file.size > 50 * 1024 * 1024) {
        this.$message({
          message: '文件大小不能超过50M',
          type: 'warning'
        })
        return false
      }
      const fileType = file.name.substr(file.name.lastIndexOf('.') + 1)
      const fileTypes = ['doc', 'docx', 'xlsx', 'xls', 'pptx', 'ppt', 'txt', 'rar', 'zip', '7z', 'jpg', 'png', 'gif', 'ico', 'icon', 'jpeg', 'bmp', 'xml', 'pdf', 'apk', 'aip', 'mp3', 'mp4', 'html']
      if (fileTypes && fileTypes.length > 0) {
        for (var i = 0; i < fileTypes.length; i++) {
          if (fileTypes[i] === fileType) {
            this.isExists = true
            break
          } else {
            this.isExists = false
          }
        }
      }
      if (this.isExists === false) {
        this.$message({
          message: '不支持此格式文件！',
          type: 'warning'
        })
        return false
      }
    },
    beforeRemove(file) {},
    // 上传附件请求
    handleChange(param) {
      const loading = this.$loading({
        lock: true,
        text: '导入中...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      const that = this
      const url = '/mp/file/notice/upload.do'
      that.$requestUpload(url, param).then((response) => {
        if (response.result === '1') {
          loading.close()
          this.$message({
            message: '上传成功',
            type: 'success'
          })
          //  路径
          const fileSite = response.path[0][0].split('|')[1]
          // 文件名
          const fileName = response.path[0][0].split('|')[0]
          const dataParmas = { fileName, fileSite }
          that.$refs['multipleTable'].list.push(dataParmas)
        }
      })
    },
    // 新增附件 未完成 附件类型必填
    inEdits() {
      if (this.formField1.vin === '') {
        return this.$message('请先选择vin码')
      }
      this.inEditPopupsVisible = true
      //vin码赋值传到下一个组件
      this.dataForForm = this.formField1.vin
    },
    // 关闭 新增窗口
    updateClose(val) {
      this.inEditPopupsVisible = val
    },
    // 删除附件
    delEvent() {
      // if (!this.selectTable.length) return this.$message('请先勾选删除数据！')
      for (let i = 0; i < this.selectTable.length; i++) {
        for (let j = 0; j < this.$refs['multipleTable'].list.length; j++) {
          if (this.selectTable[i] === this.$refs['multipleTable'].list[j]) {
            this.$refs['multipleTable'].list.splice(j, 1)
          }
        }
      }
    },
    // 删除附件
    // delEvent() {
    // const rowdata = this.$refs['multipleTable'].list[0]
    // request({
    //   url: api.deleteFile.APIUrl,
    //   method: 'post',
    //   data: rowdata
    // }).then((res) => {
    //   if (res.result === '1') {
    //     this.$message.success('删除成功')
    //   }
    // }),
    // },

    // 下载
    fileDownload(index) {
      // if (this.$refs["multipleTable"].list[index].fileSite) {
      //   this.$utils.FileDownload([
      //     this.$refs["multipleTable"].list[index].fileSite
      //   ]);
      // }
      let host = null
      const hostname = location.hostname
      const port = location.port
      const item = this.$refs['multipleTable'].list[index]
      // console.log(item)
      if (!port) {
        host = `https://${hostname}`
      } else {
        host = `http://${hostname}:${port}`
      }
      if (item.isPeer === '1') {
        const splitIndex = item.fileSite.indexOf(':') + 1
        const url = item.fileSite.slice(splitIndex)
        window.open(url)
      } else {
        window.open(`${host}${item.fileSite}`)
      }
    },
    open() {
      this.formField1.dlrCode = ''
      this.formField1.dlrShortName = ''
      this.formField1.provinceName = ''
      this.formField1.carSeriesCn = ''
      this.formField1.carConfigCode = ''
      this.formField1.carConfigCn = ''
      this.formField1.netCustName = ''
      this.formField1.netPhone = ''
      this.formField2.faultCode = ''
      this.formField3.fileType = ''

      this.tableComponents1[3].options = []
      // 获取vin
      request({
        url: '/mp/e3sh/aftersale/TechnicalAssistanceSheetService/findVinList.do',
        method: 'post',
        data: {}
      }).then((res) => {
        console.log('wwwwwww', res)
        res.rows.map((item) => {
          this.tableComponents1[7].options.push({
            label: item.vinCode,
            value: item.vin
          })
        })
      })
      // 故障编码
      request({
        url: '/mp/e3sh/aftersale/TechnicalAssistanceSheetService/findFaultCode.do',
        method: 'post',
        data: {}
      }).then((res) => {
        res.rows.map((item) => {
          this.tableComponents2[1].options.push({
            label: item.fault,
            value: item.fault
          })
        })
      })
      // 主损件号
      request({
        url: '/mp/e3sh/aftersale/TechnicalAssistanceSheetService/findFaultPartNameByMainPartCode.do',
        method: 'post',
        data: {}
      }).then((res) => {
        res.rows.map((item) => {
          this.tableComponents2[5].options.push({
            label: item.Parts,
            value: item.Parts
          })
        })
      })
    },
    // 保存
    save() {
      // 申请日期非空
      if (this.formField1.applyDate === '') {
        return this.$message('申请日期为必填')
      }
      // 类型
      if (this.formField1.type === '') {
        return this.$message('类型为必填')
      }
      // 紧急度
      if (this.formField1.urgency === '') {
        return this.$message('紧急度为必填')
      }
      // VIN码
      if (this.formField1.vin === '') {
        return this.$message('VIN码为必填')
      }
      // 车型
      if (this.formField1.carConfigCode === '') {
        return this.$message('车型为必填')
      }
      // 主题
      if (this.formField2.faultTopic === '') {
        return this.$message('主题为必填')
      }
      // 故障现象
      if (this.formField2.csCtName === '') {
        return this.$message('故障现象为必填')
      }
      // 故障系统
      if (this.formField2.faultSystem === '') {
        return this.$message('故障系统为必填')
      }
      // 故障日期
      if (this.formField2.faultDate === '') {
        return this.$message('故障日期为必填')
      }
      // 主故障件名称
      if (this.formField2.PartName === '') {
        return this.$message('主故障件名称为必填')
      }
      // 附件
      if (this.$refs['multipleTable'].list.length == 0) {
        return this.$message('请为单据添加附件')
      }
      // 申报人
      // if (this.formField2.apply === "") {
      //   return this.$message("申报人为必填");
      // }
      // 申报人电话
      // if (this.formField2.applyMobile === "") {
      //   return this.$message("申报人电话为必填");
      // }

      // 电话校验
      var pattern =
        /^(13[0-9]|14[5|7]|15[0|1|2|3|4|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/

      // 申报人电话
      // const bool = pattern.test(this.formField2.applyMobile);
      // if (!bool) {
      //   return this.$message("申报人电话格式有误！");
      // }

      // 送修人电话
      if (this.formField1.sendMobile) {
        const bool1 = pattern.test(this.formField1.sendMobile) // 申报人电话
        if (!bool1) {
          return this.$message('送修人电话格式有误！')
        }
      }
      // 附件名称 附件地址
      const file = this.$refs['multipleTable'].list

      const obj = {
        applyCode: this.formField1.applyCode, // 申请编号
        oldApplyCode: this.formField1.oldApplyCode, // 旧申请编号
        applyDate: this.formField1.applyDate, // 申请日期
        type: this.formField1.type, // 类型
        urgency: this.formField1.urgency, // 紧急度
        dlrCode: this.formField1.dlrCode, // 门店编码
        // status: this.formField1.status, //申请状态
        vin: this.formField1.vin, // VIN
        mileage: this.formField1.mileage, // 行驶里程
        engineCode: this.formField1.engineCode, // 前电机号
        engineCode2: this.formField1.engineCode2, // 后电机号
        sendName: this.formField1.sendName, // 送修人
        sendMobile: this.formField1.sendMobile, // 送修人电话
        ownerAdd: this.formField1.ownerAdd, // 车主地址

        faultTopic: this.formField2.faultTopic, // 故障标题
        faultCode: this.formField2.faultCode, // 故障编码
        faultSystem: this.formField2.faultSystem, // 故障系统
        faultDate: this.formField2.faultDate, // 故障日期
        partNo: this.formField2.partNo, // 主故障件号
        // apply: this.formField2.apply, // 申报人
        // applyMobile: this.formField2.applyMobile, // 申报人电话
        faultDesc: this.formField2.faultDesc, // 故障描述
        diagnostic: this.formField2.diagnostic, // 诊断过程
        faultReson: this.formField2.faultReson, // 故障原因
        repairMethod: this.formField2.repairMethod, // 维修方案
        file: file
      }
      const queryObj = {
        type: 'mutation',
        apiConfig: {
          ServiceCode: 'addApply',
          APIUrl:
            '/mp/e3sh/aftersale/TechnicalAssistanceSheetService/addApply.do'
        },
        variables: obj
      }
      var paramD = this.$getParams(queryObj)
      this.$requestAPI(paramD).then((response) => {
        if (response.result === '1') {
          this.$message({
            message: this.$t('sys.tips.esTip5') /* 保存成功*/,
            type: 'success',
            duration: 1000
          })
          this.curPopupsVisible = false
          this.$nextTick(() => {
            this.$parent.queryTable(1)
          })
          // 清空
          this.tableComponents1[7].options = []
          this.formField1.vin = ''
          this.formField1.carConfigCode = ''
          this.formField1.carConfigCn = ''
          this.formField1.carSeriesCn = ''
          this.formField1.produceDate = ''
          this.formField1.saleDate = ''
          this.formField1.mileage = ''
          this.formField1.engineCode = ''
          this.formField1.engineCode2 = ''
          this.formField1.batteryCode = ''
          this.formField1.netCustName = ''
          this.formField1.netPhone = ''
          this.formField1.applyCode = ''
          this.formField1.applyDate = ''
          this.formField1.type = ''
          this.formField1.urgency = ''
          this.formField1.dlrCode = ''
          this.formField1.dlrShortName = ''
          this.formField1.provinceName = ''
          this.formField1.sendName = ''
          this.formField1.sendMobile = ''
          this.formField1.ownerAdd = ''
          this.formField1.oldApplyCode = ''

          this.formField2.faultCode = ''
          this.formField2.faultTopic = ''
          this.formField2.csCtName = ''
          this.formField2.faultSystem = ''
          this.formField2.faultDate = ''
          this.formField2.partNo = ''
          this.formField2.PartName = ''
          // this.formField2.apply = "";
          // this.formField2.applyMobile = "";
          this.formField2.faultDesc = ''
          this.formField2.diagnostic = ''
          this.formField2.faultReson = ''
          this.formField2.repairMethod = ''

          this.formField3.fileType = ''
          this.$refs.multipleTable.list = []
        } else {
          // 保存失败
          this.$message({
            message: response.msg,
            type: 'warn',
            duration: 1000
          })
        }
        this.curPopupsVisible = false
      })
    },
    closeEdit() {
      this.$refs.multipleTable.list = []
      this.tableComponents1[7].options = []
      this.formField1.vin = ''
      this.formField1.carConfigCode = ''
      this.formField1.carConfigCn = ''
      this.formField1.carSeriesCn = ''
      this.formField1.produceDate = ''
      this.formField1.saleDate = ''
      this.formField1.mileage = ''
      this.formField1.engineCode = ''
      this.formField1.engineCode2 = ''
      this.formField1.batteryCode = ''
      this.formField1.netCustName = ''
      this.formField1.netPhone = ''
      this.formField1.applyCode = ''
      this.formField1.applyDate = ''
      this.formField1.type = ''
      this.formField1.urgency = ''
      this.formField1.dlrCode = ''
      this.formField1.dlrShortName = ''
      this.formField1.provinceName = ''
      this.formField1.sendName = ''
      this.formField1.sendMobile = ''
      this.formField1.ownerAdd = ''
      this.formField1.oldApplyCode = ''

      this.formField2.faultCode = ''
      this.formField2.faultTopic = ''
      this.formField2.csCtName = ''
      this.formField2.faultSystem = ''
      this.formField2.faultDate = ''
      this.formField2.partNo = ''
      this.formField2.PartName = ''
      // this.formField2.apply = "";
      // this.formField2.applyMobile = "";
      this.formField2.faultDesc = ''
      this.formField2.diagnostic = ''
      this.formField2.faultReson = ''
      this.formField2.repairMethod = ''

      this.tableComponents2[1].options = []
      this.oneTableKey = this.oneTableKey + this.$utils.generateId()
      this.$emit('close')
    }
  }
}
</script>

<style lang="scss" scoped>
.promptSpan {
  position: absolute;
  bottom: 26px;
  right: 335px;
  color: #e70020;
}
.filter-title {
  font-size: 18px;
  font-weight: bolder;
}
.filter-container.filter-title::before {
  border-left: 4px solid #0075ff;
  padding-right: 10px;
  height: 20px;
  left: 0px;
  top: 4px;
}
.prompt {
  color: #e70020;
  font-size: 13px;
  height: 15px;
  line-height: 15px;
}

/deep/.filter-params .el-col {
  margin-bottom: 15px;
}
// /deep/.filter-container .el-textarea__inner {
// 	height: 70px;
// }
.huifu {
  position: relative;
  left: 0;
  top: 0;
}
.add {
  margin-right: 19px;
}
.dele {
  margin-right: 19px;
}
.aa {
  margin-top: 15px;
  margin-bottom: 15px;
}
</style>

